<template>
	<page>
		<view class="content">
			<image class="logo" src="/static/logo.png" />
			<view class="text-area">
				<text class="title">{{ title }}</text>
			</view>
			<view class="text-area">
				<text class="title">someState88999:{{ store.state.someState }}</text>
			</view>
			<view class="text-area">
				<text class="title">someState2:{{ store.state.someState2 }}</text>
			</view>
			<view class="text-area">
				<text class="title">someState3:{{ someState3 }}{{ store.state.doubleCount }}</text>
			</view>
			<button hover-class="button-hover" @click="go('sub1')">sub1</button>
			<button hover-class="button-hover" @click="go('sub2')">sub2</button>
			<button hover-class="button-hover" @click="go('sub3')">sub3</button>
			<button hover-class="button-hover" @click="go2('sub3')">index2</button>
			<button hover-class="button-hover" @click="go('sub5')">sub5</button>
		</view>
	</page>
</template>

<script setup lang="ts">
import store from '@/store'
import { storeToRefs } from 'pinia'
import { ref } from 'vue'
import utils from '@/common/utils'
import { testApi } from '@/api/test'
import axios from '../../api/uAxios/uRequest'

async function test8(params: string) {
	try {
		const { data } = await testApi({ id: 12 })
		console.log(1, data)
	} catch (error) {
		console.log('error', error)
	}
}
test8()

const title = ref('Hello')
let { someState3 } = storeToRefs(store.state)

uni.addInterceptor('navigateTo', {
	invoke(args) {
		// request 触发前拼接 url
		// args.url = 'https://www.example.com/' + args.url
		console.log('触发前', args)
		return true
	},
	success(args) {
		// 请求成功后，修改code值为1
		// args.data.code = 1
		console.log('成功', args)
	},
	fail(err) {
		console.log('interceptor-fail', err)
	},
	complete(res) {
		console.log('interceptor-complete', res)
	}
})
store.state.someState = '88999999'
store.state.someState2 = 123
function go(name: string) {
	utils.push({
		path: '/pages/subPackages/' + name,
		query: {
			name
		}
	})
}
function go2(name: string) {
	utils.push('/pages/index/index2')
}
</script>

<style lang="scss" scoped>
.content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	.pgh {
		width: 80;
	}
}

.logo {
	height: 200rpx;
	width: 200rpx;
	margin-top: 200rpx;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 50rpx;
}

.text-area {
	display: flex;
	justify-content: center;
}

.title {
	font-size: 36rpx;
	color: #8f8f94;
}
</style>
